{% extends 'base.html' %}
{% load static %}

{% block title %}环境{% endblock %}

{% block description %}舞台那么大，总得会点啥{% endblock %}
{% block keywords %}落音艺术 钢琴培训 培训{% endblock %}

{% block viewport %}
{{ block.super }}
initial-scale=1.0, user-scalable=no,
{% endblock %}

{% block css %}
{{ block.super }}
<link href="{% static 'css/luoyin.css' %}?v={{version}}" rel="stylesheet">
{% endblock %}

{% block navsection %}
<section class="navbar-section">
    <a href="/luoyin/environment" class="btn btn-link hide-xs hide-sm active">环境</a>
    <a href="/luoyin/courses" class="btn btn-link hide-xs hide-sm">课程</a>
    <a href="/luoyin/teachers" class="btn btn-link hide-xs hide-sm">老师</a>
    <div class="input-group input-inline show-xs show-sm hide-md hide-lg hide-xl">
        <a href="#menu" class="btn btn-action input-group-btn"><i class="icon icon-menu"></i></a>
    </div>
</section>
{% endblock %}

{% block content %}
<div class="container">

    {% include 'luoyinmenu.html' with index=2 %}
    <div class="columns col-10 col-lg-10 col-md-10 col-sm-12 col-lg-auto col-md-auto col-sm-auto col-mx-auto">
        <div class="column col-12 relative">
            <samp class="img-title label label-primary">环境<i class="icon icon-bookmark"></i></samp>
            <img src="{% static 'img/env-title-img.png' %}">
        </div>

        <div class="column col-3 col-md-6 col-sm-12 mt-2">
            <img src="{% static 'img/ly_env_1.jpeg' %}" class="img-responsive">
        </div>
        <div class="column col-3 col-md-6 col-sm-12 mt-2">
            <img src="{% static 'img/ly_env_2.jpeg' %}" class="img-responsive">
        </div>
        <!--
        <div class="column col-3 col-md-6 col-sm-12 mt-2">
            <img src="{% static 'img/ly_env_3.jpeg' %}" class="img-responsive">
        </div>
        -->
        <div class="column col-3 col-md-6 col-sm-12 mt-2">
            <img src="{% static 'img/ly_env_4.jpeg' %}" class="img-responsive">
        </div>
        <div class="column col-3 col-md-6 col-sm-12 mt-2">
            <img src="{% static 'img/ly_env_5.jpeg' %}" class="img-responsive">
        </div>
        <div class="column col-3 col-md-6 col-sm-12 mt-2">
            <img src="{% static 'img/ly_env_6.jpeg' %}" class="img-responsive">
        </div>
        <div class="column col-3 col-md-6 col-sm-12 mt-2">
            <img src="{% static 'img/ly_env_7.jpeg' %}" class="img-responsive">
        </div>
        <div class="column col-3 col-md-6 col-sm-12 mt-2">
            <img src="{% static 'img/ly_env_8.jpeg' %}" class="img-responsive">
        </div>

    </div>
</div>
{% include 'luoyinfooter.html' %}
{% endblock %}

{% block javascript %}
{{ block.super }}
<script type="text/javascript" src="https://api.map.baidu.com/api?v=2.0&ak=GQMTQG63AWd3iZeNkY3NxGIlxyoeyRt6"></script>
<script src="{% static 'js/luoyin.js' %}?v={{version}}"></script>
{% endblock %}